<template>
  <div>
<!--    <custom-title name="详细信息"></custom-title>-->
    <div class="content">
      <el-row>
        <el-col :span="12">
          <el-col :span="labelSpan * 2" class="rowTitle">客户ID：</el-col>
          <el-col :span="24 - labelSpan * 2" class="rowValue">{{detailData.tenantId}}</el-col>
        </el-col>
        <el-col :span="12">
          <el-col :span="labelSpan * 2" class="rowTitle">客户名称：</el-col>
          <el-col :span="24 - labelSpan * 2" class="rowValue">{{detailData.tenantName}}</el-col>
        </el-col>

      </el-row>
      <el-row v-if="isLocation()">
        <el-col :span="12">
          <el-col :span="labelSpan * 2" class="rowTitle">节点编号：</el-col>
          <el-col :span="24 - labelSpan * 2" class="rowValue" :title="detailData.accessNode">{{detailData.accessNode}}</el-col>
        </el-col>
        <el-col :span="12">
          <el-col :span="labelSpan * 2" class="rowTitle">节点名称：</el-col>
          <el-col :span="24 - labelSpan * 2" class="rowValue" :title="detailData.platformName">{{detailData.platformName}}</el-col>
        </el-col>

      </el-row>
      <el-row>
        <el-col :span="12">
          <el-col :span="labelSpan * 2" class="rowTitle">行业应用：</el-col>
          <el-col :span="24 - labelSpan * 2" class="rowValue">{{detailData.industryName}}</el-col>
        </el-col>
        <el-col :span="12">
          <el-col :span="labelSpan * 2" class="rowTitle">应用版本：</el-col>
          <el-col :span="24 - labelSpan * 2" class="rowValue">{{detailData.appVerCode}}</el-col>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-col :span="labelSpan * 2" class="rowTitle">告警编码：</el-col>
          <el-col :span="24 - labelSpan * 2" class="rowValue">{{ detailData.alarmCode }}</el-col>
        </el-col>
        <el-col :span="12">
          <el-col :span="labelSpan * 2" class="rowTitle">算法编码：</el-col>
          <el-col :span="24 - labelSpan * 2" class="rowValue">{{ detailData.algorithmCode }}</el-col>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="labelSpan" class="rowTitle">告警流程配置名称：</el-col>
        <el-col :span="24 - labelSpan" class="rowValue">{{ detailData.alarmFlowName }}</el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
            <el-col :span="labelSpan * 2" class="rowTitle">PTZ(原始)：</el-col>
            <el-col :span="24 - labelSpan * 2" class="rowValue">P:{{ detailData.ptzP }} T:{{detailData.ptzT}} Z:{{detailData.ptzZ}}</el-col>
        </el-col>
        <el-col :span="12">
            <el-col :span="labelSpan * 2" class="rowTitle">PTZ(转义)：</el-col>
            <el-col :span="24 - labelSpan * 2" class="rowValue">P:{{ detailData.ptzTransP }} T:{{detailData.ptzTransT}} Z:{{detailData.ptzTransZ}}</el-col>
        </el-col>
      </el-row>
      <el-row v-if="orderData.warningSource == '1' || orderData.warningSource == '4'">
        <el-col :span="labelSpan" class="rowTitle">是否3D放大：</el-col>
        <el-col :span="24 - labelSpan" class="rowValue">{{ detailData.enlargeFlag }}</el-col>
      </el-row>
      <el-row>
        <el-col :span="labelSpan" class="rowTitle">综合置信度：</el-col>
        <el-col :span="24 - labelSpan" class="rowValue">{{ detailData.compConfidenceLevel }}</el-col>
      </el-row>
      <template v-for="(item, index) in detailData.pointList">
        <el-row :key="index">
          <el-row>
            <el-col :span="labelSpan" class="rowTitle">框图置信度：</el-col>
            <el-col :span="24 - labelSpan" class="rowValue">{{ item.confidenceLevel }}</el-col>
          </el-row>
          <template v-for="(subItem, i) in item.pointList">
            <el-col :span="12" :key="subItem.alarmPictureId">
              <el-row >
                <el-col :span="labelSpan * 2" class="rowTitle">框图坐标{{ i + 1 }}：</el-col>
                <el-col :span="24 - labelSpan * 2" class="rowValue">{{ subItem.percentX }},{{ subItem.percentY }}</el-col>
              </el-row>
            </el-col>
          </template>
        </el-row>
      </template>
    </div>
  </div>
</template>
<script>
import CustomTitle from "../Title.vue";
export default {
  name: 'alarmDetailInfo',
  components: {
    CustomTitle
  },
  props: {
    detailData: {
      type: Object,
      default: () => ({})
    },
    orderData:{
      type:Object,
      default:{}
    }
  },
  watch:{
    detailData(val){
      console.log(val,"+++++++++++++++++++++++++");
    }
  },
  data() {
    return {
      labelSpan: 4,
    }
  },
  methods:{
    // 是否是属地告警
    isLocation(){
      return location.href.includes('eventQueryDetail') || location.href.includes('eventLocalDetail')
    },
  }
}
</script>
<style lang="scss" scoped>
.rowTitle {
  font-size: 14px;
  font-family: PingFangSC, PingFang SC;
  font-weight: 400;
  color: #909399;
  line-height: 32px;
  text-align: right;
  max-width: 130px;
  white-space: nowrap;
}
.rowValue {
  line-height: 32px;
  font-size: 14px;
  font-family: PingFangSC, PingFang SC;
  font-weight: 400;
  color: #606266;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
</style>
